<template>
  <div class="box">
    <Header :back="true"></Header>
    <div class="cont">
      <div class="item van-hairline--bottom" v-for="(item) in dataList" :key="item.name">
        <div class="name_num">
          <div>{{item.name}}</div>
          <div>税号：{{item.num}}</div>
        </div>
        <div class="btn" @click="sysCreate(item)">
          系统生成
        </div>
      </div>
    </div>

    <div class="add_invoice" @click="$router.push('addBuyer')">添加发票抬头</div>
  </div>
</template>

<script>
import Header from "@/components/header";
export default {
  components: {
    Header,
  },
  data() {
    return {
      dataList: [
        {
          name: "合肥崇武商贸有限公司",
          num: "91340100322780708G",
        },
        {
          name: "合肥**有限公司",
          num: "91340100395454858G",
        },
        {
          name: "合肥东**贸易有限公司",
          num: "91340100382441525F",
        },
      ],
    };
  },
  methods: {
    sysCreate(item) {
      this.$router.push({
        name: "invoiceTitle",
        params: {
          num: item.num,
          name: item.name,
        },
      });
    },
  },
};
</script>

<style lang="less" scope>
.box {
  height: 100vh;
}
.cont {
  width: 96vw;
  margin: auto;
  margin-top: 0.5rem;
  box-shadow: -2px -2px 5px 3px rgba(0, 0, 0, 0.1);
  border-radius: 10px;
  height: 100vh;
}
.item {
  display: flex;
  height: 6rem;
  font-size: 14px;
  .name_num {
    flex: 5;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0 1rem;
  }
  .btn {
    flex: 1.5;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0 1rem;
    color: #07c160;
  }
}
.add_invoice {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  background-color: #07c160;
  color: #fff;
  height: 4rem;
  line-height: 4rem;
  text-align: center;
}
</style>